import React from "react";
// import Top from './components/样式/index'
// import Try from './components/state/try.jsx'
// import ChangeBg from './components/state/3-changeBg'
// import PropsCom from './components/3-props/1-try'
// import CreateRef from './components/4-ref/1-createRef'
// import RefCom from './components/4-ref/1-createRef'
// import NotControlForm from './components/5-form/1-非受控组件'
// import ControlForm from './components/5-form/2-受控组件'
// import ColorPicker from './components/5-form/3-受控组件练习'
import Slider from "./components/state/4-slider.jsx";
// import Clock from './components/6-声明周期/1-Clock'
// import StateCom from './components/7-hooks/1-StateCom'
// import Effect from './components/7-hooks/2-useEffect'
// import Todolist from './components/8-todolists/Todolist/Todolist'
// import Hero from './components/9axios/Hero'
// import A from './components/10组件通信/1-props/A'
// import A from './components/10组件通信/2-context/A'
import Hero from "./components/10组件通信/3-pubsub/Hero";
import {
  BrowserRouter,
  Routes,
  Route,
  Link,
  NavLink,
  Navigate,
  useRoutes,
} from "react-router-dom";
import Home from "./components/12root/Home/Home.jsx";
import About from "./components/12root/About/About";
import News from "./components/12root/News/News.jsx";
import Message from "./components/12root/Message/Message.jsx";
import NoFound from "./components/12root/NotFound/NotFound";
import routs from "./routs";
import HeroDetail from "./components/HeroDetail/HeroDetail.jsx";
import './app.css'
// let user = {
//     name:'孙悟空',
//     age:'不详'
// }
// let user2 = {
//     name:'猪八戒',
//     age:'不详'
// }
function App() {
  let route = useRoutes(routs);
  return route
//   <div className="qq-container container">
//   <div className="top">
//     <NavLink to="/music" >音乐馆</NavLink>
//     <NavLink to="/mine-music">我的音乐</NavLink>
//   </div>
//   {route}
// </div>;
}

export default App;
